<template>
    <div class="marketPages">
        <img mode="widthFix" class="topPicture" src="../../../static/market/topPicture.jpg" alt="" srcset="">
        <div class="listWrapper">
            <MarketList :listData="list" :baseurl="baseurl"></MarketList>
        </div>
        <i-divider v-if="!more" color="#c78550" lineColor="#c78550">我是有底线的</i-divider>
        <tabBarr current="market" />
    </div>
</template>
<script>
import tabBarr from '../../components/tabBar/tabBar'
import MarketList from '@/components/marketList/marketList'
export default {
    data() {
        return {
            page: 1,
            list: [],
            more: true,
            current: 'market',
            baseurl: ''
        }
    },
    mounted() {
        this.baseurl = this.BaseUrlImg
        this.loadMore()
    },
    onReachBottom() {
        this.loadMore()
    },
    methods: {
        loadMore() {
            if (this.more) {
                this.$http
                    .get('/market/wx/list', { pageSize: 8, page: this.page })
                    .then(res => {
                        this.page++
                        if (res.data.rows.length) {
                            this.list = this.list.concat(res.data.rows)
                        } else {
                            this.more = false
                        }
                    })
            }
        }
    },
    components: {
        MarketList,
        tabBarr
    }
}
</script>
<style lang="scss" scoped>
.marketPages {
    .topPicture {
        width: 100%;
    }
    .listWrapper {
        padding: 18rpx;
    }
}
</style>

